<template>
	<view class="tree-item" @click="toInfo">
		<image :src="prefix + info.images" class="tree-img" mode="aspectFill"></image>
		<view class="tree-area">
			<view class="f-s-14 f-w-b">{{ info.name }}</view>
			<view class="f-s-12 u-info u-m-t-12">树木类型：{{info.treeType?.name}}</view>
		</view>
	</view>
</template>

<script setup>
	import config from '@/config'
	const prefix = config.imgPrefix
	
	const props = defineProps({
		info: Object,
	})
	
	const toInfo = ()=>{
		uni.navigateTo({
			url: '/subPackages/tree/info?id=' + props.info.id
		})
	}
</script>

<style lang="scss" scoped>
	.tree-item{
		width: 100%;
		border-radius: 12rpx;
		background-color: #fff;
		.tree-img{
			width: 100%;
			height: 320rpx;
			border-radius: 12rpx 12rpx 0 0;
		}
		.tree-area{
			border-radius: 0 0 12rpx 12rpx ;
			padding: 16rpx 24rpx;
		}
	}

</style>